<!DOCTYPE html>
<html >
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>用户资金管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="../../../xbr_layui_extend/layui-v2.6.8/css/layui.css">
</head>
<body>
<div class="layui-fluid" style="padding: 15px;">
    <form class="layui-form" action="" lay-filter="form-post" id="userForm" method="post" >
        <div class="layui-row">
            <div class="layui-col-xs5">
                <div class="layui-form-item">
                    <label class="layui-form-label">转账批次号</label>
                    <div class="layui-input-block">
                        <input type="text" name="batchNo" lay-verify="required" placeholder="转账批次号" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-col-xs5">
                <div class="layui-form-item">
                    <label class="layui-form-label">仅查询状态</label>
                    <div class="layui-input-block">
                        <select  name="queryType" lay-verify="required">
                            <option value="0">查询批次全部记录</option>
                            <option value="1">仅查询成功的记录</option>
                            <option value="2">仅查询失败的记录</option>
                            <option value="3">仅查询处理中记录</option>
                            <option value="4">仅查询退票的记录</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="layui-col-xs2">
                <div class="layui-form-item" style="text-align: center">
                    <a class="layui-btn" lay-submit="" lay-filter="post-btn">查询</a>
                </div>
            </div>
        </div>
    </form>
    <!--表格部分-->
    <table class="layui-hide" id="accTable" lay-filter="accTable"></table>
    <div id="accTablePage"></div>
    <!--隐藏模板 -->
    <script type="text/html" id="bar">
        <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="detail">详情</a>
    </script>
</div>

<script src="../../../xbr_layui_extend/layui-v2.6.8/layui.js"></script>
<script>
    layui.extend({
        admin: '/platform/xbr_layui_extend/admin' //集成路径
    }).use(["admin",'form','table'], function () {
        const $ = layui.$, form = layui.form,admin = layui.admin,table = layui.table;

        //加载TABLE
        function refTable(field){
            admin.req({
                url: "/platform/pab/batchQueryTrade",
                data: {batchNo: field.batchNo,queryType:field.queryType, page: 1, limit: 500},
                done: function (res) {
                    if (res.data == null) return;
                    table.render({
                        elem: '#accTable',
                        cols: [[ //标题栏
                            {field: 'inAcctName', title: '收款人'},
                            {field: 'inAcctNo', title: '收款账号'},
                            {field: 'inAcctBankName', title: '开户行'},
                            {field: 'tranAmount', title: '金额'},
                            {field: 'stt', title: '状态', width: 98,templet:(d)=>sttNames(d["stt"])},
                            {fixed: 'right', title:'操作', toolbar: '#bar', width:78}
                        ]],
                        data: res.data['itemList'],
                        page: true,
                    });
                }
            });
        }

        //监听行工具事件
        table.on('tool(accTable)', function (obj) {
            const data = obj.data;
            if (obj.event === 'detail') {
                layer.open({
                    type: 2,
                    area: ['720px',"560px"],
                    title: "交易详情",
                    content: ['./querySingleTransfer.html'],
                    success:function (layero, index) {
                        const iframe = window['layui-layer-iframe' + index];
                        iframe['child'](data["sThirdVoucher"]);
                    }
                });
            }
        });

        //上传完毕 提交表单
        form.render(null, 'form-post');
        form.on('submit(post-btn)', function (data) {
            refTable(data.field);
            return false;
        });

        //交易状态
        function sttNames(state) {
            switch (state) {
                case "20": return "20-交易成功";
                case "30": return "30-交易失败";
                case "40": return "40-处理中";
                default: return state+"-银行受理中";
            }
        }
    });
</script>
</body>
</html>